---
# Only the main Sass file needs front matter (the dashes are enough)
---
@charset "utf-8";

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url({{ site.baseurl }}/assets/roboto.ttf) format('truetype');
}


$base-font-family:  Roboto, Arial, sans-serif;
$base-font-size:    16px;
$small-font-size:   0.875 * $base-font-size;
$base-line-height:  1.5;
$base-font-weight:  400;
$bold-font-weight:  600;

$spacing-unit:      32px;

$global-background: #e5e5e5;
$content-background: #fff;

$text-color:        lighten(#000, 13%);
$text-color-light:  lighten(#000, 46%);
$primary-color:     #1976d2;

$content-width:     1000px;

$phone:             500px;
$tablet:            750px;


@mixin media-query($device) {
    @media screen and (max-width: $device) {
        @content;
    }
}

@import
    "base",
    "layout",
    "syntax-highlighting"
;
